<template>
<div class="whole">
  <h2 class="title">eggblog平台登陆</h2>
    <a-form
    id="components-form-demo-normal-login"
    :form="form"
    class="login-form"
    @submit="handleSubmit"
  >
    <a-form-item>
      <a-input
        v-decorator="[
          'email',
          { rules: [{ required: true, message: '请输入你的用户名!'}] },
        ]"
        placeholder="E-mail" 
      >
        <a-icon slot="prefix" type="user" style="color: rgba(0,0,0,.25)" />
      </a-input>
    </a-form-item>
    <a-form-item>
      <a-input
        v-decorator="[
          'password',
          { rules: [{ required: true, message: '请输入你的密码!' }] },
        ]"
        type="password"
        placeholder="Password" 
      >
        <a-icon slot="prefix" type="lock" style="color: rgba(0,0,0,.25)" />
      </a-input>
    </a-form-item>
    <a-form-item>
      <a-checkbox
        v-decorator="[
          'remember',
          {
            valuePropName: 'checked',
            initialValue: true,
          },
        ]"
        class="check"
      >
        记住密码
      </a-checkbox>
      <a class="login-form-forgot" href="">
        
        <router-link :to="{path:'/forget'}">忘记密码</router-link>
      </a>
      <a-button type="primary" html-type="submit" class="login-form-button">
        登陆
      </a-button>
      Or
      <a href="">
        <router-link :to="{path:'/register'}">立即注册!</router-link>
      </a>
    </a-form-item>
  </a-form>
</div>

</template>

<script>
export default {
  data(){
    return{
    }
  },
  beforeCreate() {
    this.form = this.$form.createForm(this, { name: 'normal_login' });
  },
  methods: {
    handleSubmit(e) {
      e.preventDefault();
      this.form.validateFields(async (err, values) => {
        if (!err) {
          // console.log(values)
          if(values.email == 'admin'){
            const{data:res} = await this.$http.get("http://localhost:8081/user/admin",{params:{account:values.email,password:values.password}})
            if(res.code == 200){
              this.$message.success("登陆成功")
              window.sessionStorage.setItem('admintoken',res.admintoken)
              window.sessionStorage.setItem("author",values.email)
              this.$router.push('/home')
            }
            else{
              this.$message.warning("用户名或密码错误")
            }
          }
          
          else{
            const {data: res} =await this.$http.get("http://localhost:8081/user/login",{params:{email:values.email,password:values.password}})
            if(res.code == 300)
            {
              this.$message.error("该用户不存在")
            }
            else if(res.code == 400){
              this.$message.warning("用户名或密码错误")
            }
             else if(res.code == 500){
              this.$message.warning("该用户已被禁用")
            }
            else if(res.code == 200){
              this.$message.success("登陆成功")
              window.sessionStorage.setItem("author",values.email)
              window.sessionStorage.setItem('token',res.token)
              this.$router.push('/home')
            }
              // .then(response =>{
              //   console.log('*:'+response)
              //   // this.$router.push('/list')
              // })
              // .catch(error =>{
              //   console.log("error："+error)
              // })
          }          
        }
      });
    },
  },
};
</script>
<style>
#components-form-demo-normal-login .login-form {
  max-width: 300px;
}
#components-form-demo-normal-login .login-form-forgot {
  float: right;
}
#components-form-demo-normal-login .login-form-button {
  width: 100%;
}
#components-form-demo-normal-login{
  width: 500px;
  position: relative;
  left: 30%;
  top: 30%;
}
.whole{
  background-color: #2b4b6b;
  height: 100%;
}
.title{
  font-size: 30px;
  font-family: '隶书';
  position: absolute;
  top: 20%;
  left: 43%;
}
.check{
  position: relative;
  left: -35%;
}
</style>